<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
    <title></title>
    <!--preload-links-->
    <!--app-context-->
	<style>
	*{
		padding: 0;
		margin: 0;
	}
	body{
		height: auto !important;
		max-height: 999999px;
	}
	</style>
  </head>
  <body>
    <div id="app"><!--app-html--></div>
    <script type="module" src="/main.js"></script>
	<script>
	 function handleFontSize() {
		// 设置网页字体为默认大小
		WeixinJSBridge.invoke('setFontSizeCallback', {
			'fontSize': 0
		});
		// 重写设置网页字体大小的事件
		WeixinJSBridge.on('menu:setfont', function () {
			WeixinJSBridge.invoke('setFontSizeCallback', {
				'fontSize': 0
			});
		});
	}
	// 我的根html字体是 font-size:calc(100vw/7.5);
	function countFont1(){
	    var originRootFontSize = parseFloat(window.getComputedStyle(document.documentElement, null).getPropertyValue('font-size'));
	    var realSize =  document.documentElement.clientWidth/7.5; // 这里的7.5是我自己，你看着调
	    
	    console.log("originRootFontSize："+originRootFontSize + "realSize:" + realSize); //  系统字体放大缩小，originRootFontSize 和 realSize相等的话就可以了
	    
	    if (originRootFontSize === realSize) {
	        return;
	    }
	    // 计算原字体和放大后字体的比例
	    var scaleFactor = realSize / originRootFontSize ;
	
	    // 取html元素的字体大小
	    // 注意，这个大小也经过缩放了
	    // 所以下方计算的时候 *scaledFontSize是原来的html字体大小
	    // 再次 *scaledFontSize才是我们要设置的大小
	    if (scaleFactor !== 1) {
	        document.getElementsByTagName('html')[0].style.cssText = 'font-size:' + originRootFontSize * scaleFactor * scaleFactor  + 'px !important';
	    }
		if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
			handleFontSize();
		} else {
			if (document.addEventListener) {
				document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
			} else if (document.attachEvent) {
				document.attachEvent("WeixinJSBridgeReady", handleFontSize);
				document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
			}
		}
	}
	window.onresize =function() {
	    setTimeout(() =>{ // 我这里是设置延时覆盖原先全局 html 的font-size
	        countFont1();
	    },50)
	}
	 
	(function(){
	   setTimeout(() =>{  // 我这里是设置延时覆盖原先全局 html 的font-size
	    countFont1();
	   },50)
	}); 
	</script>
  </body>
</html>
